<template>
	<view class="bizPage">
		<status-bar title="HR" :placeholder="false" hideBg color="#fff" />
		<view class="head p-re">
			<image class="wh" :src="staticImg + 'banner.png'" mode="aspectFill"></image>
			<view class="title d-flex a-center p-ab">
				<view class="line m-right20"></view>
				<view class="size36 white">请选择企业加入</view>
			</view>
			<view class="card p-ab">
				<view class="size30 color-222 bold p-left10 m-bot20">您还未加入任何企业，请选择企业加入</view>
				<view class="input d-flex a-center">
					<view class="size26 color-222">企业名称：</view>
					<view class="flex-1 size26 color-999">请选择企业名称加入</view>
					<text class="iconfont icon-a-zujian32 size24 color-999"></text>
				</view>
			</view>
		</view>
		<view class="btn flexac size28 white">申请加入</view>
	</view>
</template>

<script setup>
	import { staticImg } from '@/utils/config.js'
	import statusBar from '../components/statusBar.vue'
	
</script>

<style lang="scss" scoped>
	.bizPage {
		height: 100vh;
		background: #F9F9F9;
	}
	.head {
		height: 500rpx;
	}  
	.title {
		left: 40rpx;
		top: 230rpx;
		.line {
			width: 8rpx;
			height: 36rpx;
			background: #0B77F0;
		}
	}
	.card {
		width: 710rpx;
		height: 266rpx;
		background: linear-gradient(#EAF4FE, #FFFFFF);
		border-radius: 20rpx;
		top: 320rpx;
		left: 20rpx;
		padding: 60rpx 20rpx 0;
		.input {
			height: 90rpx;
			border: 1rpx solid #F2F2F2;
			border-radius: 10rpx;
			padding: 0 20rpx;
		}
	}
	.btn {
		width: 690rpx;
		height: 82rpx;
		background: #0B77F0;
		border-radius: 20rpx;
		position: fixed;
		bottom: calc(60rpx + constant(safe-area-inset-bottom));
		bottom: calc(60rpx + env(safe-area-inset-bottom));
		left: 30rpx;
		z-index: 1;
	}
</style>
